import Vue from 'vue'
import VueRouter from 'vue-router'

// 引入路由组件
import Home from '@/views/Home/My_Home.vue'
import Login from '@/views/Login/My_Login.vue'
import Register from '@/views/Register/My_Register.vue'
// import Search from '@/views/Search/My_Search.vue'
import Search from '@/views/Search/index.vue'

// 先把VueRouter原型对象的push，先保存一份
const originPush = VueRouter.prototype.push
const originReplace = VueRouter.prototype.replace
// 重写push|replace
// 第一个参数，告诉原来push方法，你往哪里跳转（传递那些参数）
// 第二个参数，成功的回调
// 第三个参数，失败的回调
VueRouter.prototype.push = function(location, resolve, reject) {
  if (resolve && reject) {
    // call || apply区别
    // 相同点：都可以调用函数一次，都可以篡改函数的上下文一次
    // 不同点：call与apply传递参数：call传递参数用逗号隔开，apply方法执行，传递数组
    originPush.call(this, location, resolve, reject)
  } else {
    originPush.call(this, location, () => {}, () => {})
  }
}

VueRouter.prototype.replace = function(location, resolve, reject) {
  if (resolve && reject) {
    originReplace.call(this, location, resolve, reject)
  } else {
    originReplace.call(this, location, () => {}, () => {})
  }
}

// 使用插件
Vue.use(VueRouter)

const routes = [
  // 重定向，在项目跑起来的时候，访问/，立马让他定向到首页
  { path: '/', redirect: '/home', meta: { show: true } },
  { path: '/home', component: Home, meta: { show: true } },
  { path: '/login', component: Login, meta: { show: true } },
  { path: '/register', component: Register, meta: { show: false } },
  {
    path: '/search/:keywords?',
    name: 'search',
    component: Search,
    meta:
    {
      show: true
    },
    // 路由组件能不能传递props数据？
    // 布尔值写法：只能传递params
    // props: true
    // 对象写法:额外的给路由组件传递一些props
    // props: { a: 1, b: 2 }
    // 函数写法：可以params参数、query参数，通过props传递给路由组件
    props: ($route) => ({ keywords: $route.params.keywords, k: $route.query.k })
  }
]

// 配置路由
const router = new VueRouter({
  routes
})

export default router
